body {
    background-color: #E8E8E8;
}

// 轮播图
.swiper-container {
    height: 100px;

    .swipbg {
        width: 414px;
        height: 200px;
    }
}

// 用户名
.uname {
    height: 210px;
    width: 100%;
    padding: 0 20px;
    position: relative;
    background-color: #fff;

    a {
        position: absolute;
        top: 0;
        display: block;
        width: 100%;
        height: 100%;
        z-index: 12;
    }

    .usern {
        width: 100%;
        height: 210px;

        .aa {
            margin-top: 25px;
        }

        .left {
            position: relative;

            .pho {
                width: 120px;
                height: 120px;
                border-radius: 50%;
                border: 1px solid #4294FF;

            }

            .iconfont {
                position: absolute;
                bottom: -10px;
                left: 85px;
                font-size: 40px;
                color: orange;
            }

            p {
                padding-left: 14px;
                font-size: 22px;
            }
        }

        .right {
            .iconfont {
                font-size: 24px;
            }
        }

        .sign {
            margin-top: 20px;

            p {
                color: rgb(138, 138, 138);
                font-size: 18px;
                font-family: PingFangSC-regular;
            }
        }
    }
}

// 累计打卡
.card {
    margin-top: 20px;
    height: 80px;
    width: 100%;
    background-color: #fff;

    .left {
        margin-left: 20px;

        .iconfont {
            background-color: #4294FF;
            font-size: 24px;
            margin-right: 10px;
        }

        span {
            font-size: 18px;
        }

        .num {
            color: #4294FF;
            font-weight: bold;
            font-size: 26px;
        }
    }

    .right {
        margin-right: 20px;

        p {
            width: 103px;
            height: 40px;
            line-height: 40px;
            border-radius: 20px;
            background-color: rgba(170, 217, 247, 1);
            color: rgba(0, 78, 115, 1);
            font-size: 20px;
            text-align: center;
            font-weight: bold;
            font-family: Arial;
        }
    }
}

// 个人动态
.person {
    margin-top: 20px;
    height: 70px;
    width: 100%;
    background-color: #fff;
    padding: 0 20px;

    .left {
        font-size: 18px;

        .iconfont {
            margin-right: 10px;
            color: #4294FF;
            font-size: 24px;
        }
    }

    .right {
        p {
            width: 50px;
            height: 22px;
            color: rgba(138, 138, 138, 1);
            font-size: 16px;
            font-family: PingFangSC-regular;
        }

        .iconfont {
            font-size: 24px;
        }
    }
}

// 运动数据
.data {
    display: block;
    height: 180px;
    width: 100%;
    background-color: #fff;
    margin-top: 20px;
    padding: 0 20px;

    .top {
        padding-top: 21px;

        .l {
            span {
                background-color: #4294FF;
                font-size: 24px;
                margin-right: 10px;
            }

            p {
                height: 25px;
                color: rgb(16, 16, 16);
                font-size: 18px;
                font-family: PingFangSC-regular;
            }
        }

        .r {
            span {
                font-size: 24px;
            }
        }
    }

    .down {
        margin-top: 20px;

        .word {
            height: 22px;
            color: rgba(138, 138, 138, 1);
            font-size: 16px;
            font-family: PingFangSC-regular;

        }

        .num {
            margin-top: 15px;
            height: 48px;
            color: rgba(66, 148, 255, 1);
            font-size: 40px;
            font-family: SFUIText-regular;

        }

        .a1 {
            position: relative;
        }

        .mins {
            position: absolute;
            bottom: 0;
            right: 10px;
            color: rgba(138, 138, 138, 1) !important;
            font-size: 16px;
        }



        .mid {
            display: block;
            width: 3px;
            height: 80px;
            background-color: #E8E8E8;
        }

        .r {
            width: 166px;
            margin-left: 20px;
        }

        .l {
            width: 166px;
        }
    }
}

// 徽章
.badge {
    display: block;
    height: 180px;
    width: 100%;
    background-color: #fff;
    margin-top: 20px;
    padding: 0 20px;

    .top {
        padding-top: 21px;

        .l {
            span {
                background-color: #4294FF;
                font-size: 24px;
                margin-right: 10px;
            }

            p {
                height: 25px;
                color: rgb(16, 16, 16);
                font-size: 18px;
                font-family: PingFangSC-regular;
            }
        }

        .r {
            span {
                font-size: 24px;
            }
        }
    }

    .down {
        margin-top: 15px;

        img {
            width: 100px;
            height: 100px;
            background-color: #fff;
            text-align: center;
            border: 1px solid rgba(187, 187, 187, 1);
            border-radius: 50%;
        }
    }
}